/**
 * @file HeaderRight
 * @description 头部右侧组件
 * @date 2021-05-10 16:30:00
 */
import React, { useState, } from 'react';
import { Avatar, Menu, Dropdown,Space } from 'antd';
import {loginOut} from '@/utils/index'
import ThemeSwitch from '@/components/ThemeSwitch';


const HeaderRight: React.FC = () => {
    const [visible, setVisible] = useState(false);

    const handleMenuClick = (e: any) => {
        switch (e.key) {
            case 'layout':
                loginOut()
                break;
            default:
                break;
        }
        setVisible(false);
    };

    const handleVisibleChange = (visible: boolean) => {
        setVisible(visible);
    };

    const menu = ()=>(
        <Menu onClick={handleMenuClick}>
            <Menu.Item key="layout">退出登录</Menu.Item>
        </Menu>
    );
    

    return (
        <Space>
            {/* <ThemeSwitch /> */}
            <Dropdown
                dropdownRender={menu}
                trigger={['click']}
                open={visible}
                onOpenChange={handleVisibleChange}
            >
                <Avatar size="default" src="https://img.alicdn.com/tfs/TB1YHEpwUT1gK0jSZFhXXaAtVXa-28-27.svg" />
            </Dropdown>
        </Space>
    );
};

export default HeaderRight;
